<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script>
        <style type="text/css">
        .header {
            padding: 2.5rem 0.5rem 2rem 0.5rem;
        }
    </style>
</head>

<body>
    <header class="aui-bar aui-bar-nav" style="padding-top:25px;">
        <a class="aui-pull-left aui-btn" onclick="closeWin()">
            <span class="aui-iconfont aui-icon-left"></span>
        </a>
        <div class="aui-title">可大金服OA</div>
        <a class="aui-pull-right aui-btn nav-btn">
        </a>
    </header>
    <div class="menu">
        <ul>
            <li  class="li_index" class='active' id="type0" onclick="changeType(0);" style="text-align:center">未审批</li>
            <li  class="li_index" id='type1' onclick="changeType(1);" style="text-align:center">已通过</li>
            <li  class="li_index" id='type2' onclick="changeType(2);" style="text-align:center">未通过</li>
        </ul>
    </div>
    <!-- <ul class="list-t">
        <li class="active">已通过</li>
        <li>未通过</li>
    </ul> -->

    <div class="approval" id='list'>

    </div>

    <script type="text/template" id="template">
      {{~it:value:index}}
      <dl onclick="approveDetails({{=value.id}},{{=value.apply_status}});">
          <dt>
          <p>{{=value.user_name}}</p>
          {{? value.apply_status == 0}}
          <span>未审批</span>
          {{?? value.apply_status == 1}}
          <span>审核通过</span>
          {{??}}
          <span>未通过</span>
          {{?}}
      </dt>
          <dd>
            {{=value.name}}
              <span>{{=value.create_time}}</span>
          </dd>
      </dl>
      {{~}}

    </script>


    <!-- <div class="foot-t"></div>
<ul class="foot">
  <li>
    <i class="aui-iconfont aui-icon-home"></i>
    <p>首页</p>
  </li>
  <li>
    <i class="aui-iconfont aui-icon-my"></i>
    <p>我的</p>
  </li>
</ul>
</body> -->

    <script type="text/javascript" src="./script/api.js"></script>
    <script type="text/javascript">
        apiready = function() {
         getData(0);
         $("#type0").addClass('active');

        }

        function getData(type) {
          var id = $api.getStorage('id');

          api.ajax({
              url: 'http://oa.big-wealth.com/index.php?m=&c=info&a=info_apply_list&api_auth_id='+id,
              method: 'get',
              data: {
                  values: {
                      // name: 'haha'
                  },

              }
          },function(ret, err){
              if (ret) {
              // console.log(JSON.stringify(ret));
              // alert( JSON.stringify( ret ) );

              var data  = [];
              data = screen_data(ret,type);
                var template = $api.byId('template');
                var dotFn = doT.template(template.innerHTML);
                var html = dotFn(data);
                var list = $api.byId('list');
                $api.html(list, html);
              } else {
                  alert( JSON.stringify( err ) );
              }
          });

        }

        function changeType(id) {
            var li_id = 'type' + id;
            $(".li_index").removeClass("active");
            $("#" + li_id).addClass('active');
            getData(id);
        }

        function screen_data(ret,type) {
          back_array=[];
          // console.log(JSON.stringify(ret));

          for (var i = 0; i < ret.data.length; i++) {
            // console.log(JSON.stringify(ret.data[i]));
            if (ret.data[i].apply_status==type) {
              ret.data[i].create_time = getDate(ret.data[i].create_time)
              back_array.push(ret.data[i]);
            }
          }
          return back_array;

        }




        function openClub() {
            var delay = 0;
            if (api.systemType != 'ios') {
                delay = 300;
            }
            api.openWin({
                name: 'club_win',
                url: './html/club_win.html',
                bounces: false,
                delay: delay,
                slidBackEnabled: true,
                vScrollBarEnabled: false,
                progress: {
                    type: "page"
                }
            });
        }
        $(".nav-btn").on("click", function() {
            $(".nav").slideToggle(100);
        })
        $(".nav .aui-list-item").on("click", function() {
            $(".nav").hide();
        })

        function closeWin() {
            api.closeWin({});
        }

        function approveDetails(id,type) {
          // alert(type);



            api.openWin({
                name: 'approval_details_sq',
                url: './approval_details_sq.html',
                pageParam: {
                    id: id
                }
            });


        }
    </script>

</html>
